<template>
  <div>
    <h2 align="center">用户借款页面</h2>
    <table class="table table-bordered">
      <tr>
        <td>借款款项名称:</td>
        <td>
          {{list.B_Name}}
        </td>
      </tr>

      <tr>
        <td>最高金额:</td>
        <td>
          {{ list.B_Money }}
        </td>
      </tr>

      <tr>
        <td>利息:</td>
        <td>
          {{ list.BI_Number }}
        </td>
      </tr>

      <tr>
        <td>借款金额:</td>
        <td>
          <input type="text" v-model="UB_Money" >
        </td>
      </tr>

      <tr>
        <td>每月还款金额:</td>
        <td>
           {{ (((list.BI_Number*Number(UB_Money))+Number(UB_Money))/12).toFixed(2) }}CNY
        </td>
      </tr>

      <tr>
        <td></td>
        <td>
          <input type="button" @click="SuerBorrow" value="确认借款" class="btn btn-primary">
        </td>
      </tr>
    </table>
  </div>
</template>

<script setup lang="ts">

import {onMounted, reactive,toRefs} from 'vue';

import { useRouter,useRoute } from 'vue-router';

import axios from 'axios';

import {useUserStore} from '../../store/user'
let userStore = useUserStore();

//路由
let router = useRouter();
let route = useRoute();

//响应式数据
let data:any =reactive({
  list:[],
  //借款金额
  UB_Money:''
})

//解构
let {list,UB_Money} = toRefs(data);

//生命周期钩子函数
//页面加载时
onMounted(()=>{
  getData()
})

//反填
const getData=()=>{
  axios({
    url:'/api/Borrow/BackInfo',
    method:'get',
    params:{
      B_Id:route.query.B_Id
    }
  }).then((res)=>{
    console.log(res);
    
    list.value = res.data.data[0]
  }).catch(err=>{
    console.log(err);
  })
}

//确认借款
const SuerBorrow =()=>{
  //非空验证
  //有效性验证
  if(UB_Money.value==''){
    return alert('借款金额不能为空')
  }
  if(isNaN(UB_Money.value)){
    return alert('借款金额必须为数字') 
  }
  if(UB_Money.value<0 || UB_Money.value>list.value.B_Money){
    return alert('借款金额必须在0到'+list.value.B_Money+'之间')
  }
  //提交数据
  axios({
    url:'/api/Borrow/PostAddUserBorrow',
    method:'post',
    data:{
      B_Id:route.query.B_Id,
      UB_Money:UB_Money.value,
      U_Id:userStore.userInfo.U_Id
    }
  }).then(res=>{
    console.log(res);
    if(res.data.data>0){
      alert('借款成功')
      router.push('/main/userBorrwoList')
    }else{
      return alert('借款失败')
    }
  }).catch(err=>{
    console.log(err);
    
  })
}

//添加
// const AddBorrowInfo =()=>{
//   //非空判断
//   if(addBorrowData.value.B_Name==""){
//     return alert('借款款项名称不能为空')
//   }
//   if(addBorrowData.value.B_Money==""){
//     return alert('借款最高金额不能为空')
//   }
//   if(isNaN(addBorrowData.value.B_Money)){
//     return alert('借款最高金额必须为数字') 
//   }
//   if(addBorrowData.value.B_Money<0 || addBorrowData.value.B_Money>1000000){
//     return alert('借款最高金额必须在0到1000000之间')
//   }
//   if(addBorrowData.value.B_Year==""){
//     return alert('借款最高年限不能为空')
//   }
//   if(isNaN(addBorrowData.value.B_Year)){
//     return alert('借款最高年限必须为数字') 
//   }
//   if(addBorrowData.value.B_Year<1 || addBorrowData.value.B_Year>10){
//     return alert('借款最高年限必须在1到10之间')
//   }
//   if(addBorrowData.value.B_Show==""){
//     return alert('借款款项简介不能为空')
//   }
//   if(addBorrowData.value.BI_Id==0){
//     return alert('请选择利息')
//   }
//   //发送请求
//   axios({
//     url:'/api/Borrow/PostAddBorrow',
//     method:'post',
//     data:addBorrowData.value
//   }).then(res=>{
//     console.log(res);
//     if(res.data.data==-1){
//       return alert('该借款项目已存在')
//     }else if(res.data.data>0){
//       alert('添加成功')
//       router.push('/main/adminBorrowList')
//     }else{
//       return alert('添加失败')
//     }
//   }).catch(err=>{
//     console.log(err);
    
//   })
// }



</script>

<style scoped>

</style>